import React from 'react'
import {inject, observer} from 'mobx-react';
import {toJS} from 'mobx';
import {Tools,Button } from 'weaver-mobile';
import { withRouter } from 'react-router-dom';
const getLabel = Tools.getLabel;

@withRouter
@inject ('receptionStore')
@observer
class AutoCheck extends React.Component {
    constructor(props){
        super(props);

    }

    static defaultProps = {
        prefixCls:"fna-autoCheck"
    }

    componentDidMount() {

    }

    componentWillReceiveProps(nextProps){

    }

    shouldComponentUpdate(nextProps, nextState) {
        return true;        // 记得要返回true
    }


    render() {
        const { receptionStore,prefixCls,isForm,invoiceResult } = this.props;
        const { currentInvoiceId } = receptionStore;


        return (
            <div className={`${prefixCls}`}>
                <header>
                    <div>{invoiceResult.title}</div>
                    <span>{invoiceResult.status}</span>
                </header>

                {invoiceResult && invoiceResult.conditions.map(group =>{
                    let comment = '';
                    if(group.col == 1){
                        comment = 
                            <div className={"fna-autoCheck-row"}>
                                {group.items.map((f,index) =>(
                                    <div className={"row-col_1"}>
                                        <div>{f.title}</div>
                                        <div style={{color:group.key == 'taxIncludedPrice' ? 'red' : '#888'}}>{f.value}</div>
                                    </div>
                                ))}
                            </div>
                    }else if(group.col == 2){
                        comment = 
                            <div className={"fna-autoCheck-row"}>
                                {group.items.map(f =>(
                                    <div className={"row-col_2"}>
                                        <div>{f.title}</div>
                                        <div style={{fontWeight:(group.key == 'priceWithoutTax_tax' || group.key == 'invoiceNumber_invoiceCode') ? '500' : '400'}}>{f.value}</div>
                                    </div>
                                ))}
                            </div>
                    }
                    return comment;
                })}


                {isForm ? 
                    <footer className={'fna-autoCheck-footer fna-autoCheck-footer-isForm'}>
                        <Button type="gost"  onClick={this.handleSubmit}>{getLabel(86,'保存')}</Button>
                        <Button type="primary"  disabled={parseInt(currentInvoiceId) > 0 ? false : true} onClick={this.doSure}>{getLabel(826,'确定')}</Button>
                    </footer>
                    : 
                    <footer className={'fna-autoCheck-footer'}>
                        <Button type="primary"  onClick={this.handleSubmit}>{getLabel(86,'保存')}</Button>
                    </footer>
                }
            </div>
        )
    }
    
    handleSubmit = (paramsObj,value) =>{
        const {receptionStore,checkJson} = this.props;
        const {saveInvoiceByCheck} = receptionStore;
        // alert('handleSubmit')
        // alert(JSON.stringify(checkJson))
        let _checkJson = JSON.stringify(checkJson);
        saveInvoiceByCheck({
            checkJson:_checkJson
        })
    }

    //回显到form 
    doSure = () =>{
        const {receptionStore,history,reset_tjfj,jump,invoiceIds} = this.props;
        const {currentInvoiceId,setCurrentInvoiceId} = receptionStore;
        
        let ids = invoiceIds;
        
        if(invoiceIds == 'undefined' || invoiceIds == '' || invoiceIds == undefined){
            ids = currentInvoiceId;
        }else{
            ids += ','+currentInvoiceId;
        }
           
        setCurrentInvoiceId('');
        reset_tjfj(ids);
        if(jump){
            history.go(-2);
        }else{
            history.go(-1);
        }
        
    }


    

}

export default AutoCheck;